import React, {PureComponent} from 'react';
import './miaosha.scss';


class Miaosha extends PureComponent{
    constructor(props){
        super(props);
        this.state={
             daojishi:['00','00','00']
        }
        this.timer = null
    }
    componentDidMount(){
        const startTime = this.props.miaoshaObj.currentTime;
        const endTime = this.props.miaoshaObj.endTime;
        let miaoshaTime = new Date(endTime) - new Date(startTime);
        this.timer=setInterval(()=>{
            miaoshaTime -= 1000;
            let time = this.formatTime(miaoshaTime)
            // console.log(time);
            this.setState({daojishi:time})
        },1000)
       

    }
     formatTime = (date) =>{
        let time = date/1000;
        const s = Math.floor(time%60)
        const m = Math.floor(time/60%60)
        const h = Math.floor(time/60/60)
        return [h,m,s].map(this.addZero)
    }
    addZero = (n) =>{
        n = n.toString();
        return n[1]?n:'0'+n;
    }
    render(){
        const { miaoshaObj } = this.props;
        const {daojishi} = this.state;
        return (
            <div className="miaosha_con">
            <img src={miaoshaObj.pictureURL} alt={miaoshaObj.asseName} className="miaosha_img" />
            <div className="daojishi">
                <span>{daojishi[0]}</span> : <span>{daojishi[1]}</span> :<span>{daojishi[2]}</span>

            </div>
        </div>
        )
    }
    componentWillUnmount(){
        clearInterval(this.timer);
        this.setState=(state,callback)=>{
            return;
        }
    }
}
export default Miaosha;